導入存檔時同步旋轉翻轉狀態

這是一個重要的細節。為了確保導入存檔時,畫面的旋轉(Rotate)和翻轉(Flip)狀態能與存檔內的數據保持一致,我們需要在解析 JSON 後,提取 FEN 字串中的標識位,並更新全局變量 isRotateEnabled 和 isFlipEnabled。

請修改以下兩個部分:

1. 修改 tool-open 的文件導入邏輯

找到處理文件讀取的 reader.onload 部分(大約在第 1251 行):

JavaScript

        // Open file tool
       document.getElementById('tool-open').addEventListener('click', () => {
           const input = document.createElement('input');
           input.type = 'file';
           input.accept = '.json';
           input.onchange = e => {
               const file = e.target.files[0];
               const reader = new FileReader();
               reader.onload = event => {
                   try {
                       const imported = JSON.parse(event.target.result);
                       if (imported.historyFEN) {
                           historyFEN = imported.historyFEN;
                           currentBranch = imported.currentBranch || [];
                           currentStepIndex = imported.currentStepIndex || 0;
                           moveInterval = parseFloat(imported.moveInterval) || moveInterval;
                           moveSpeed = parseFloat(imported.moveSpeed) || moveSpeed;

                           // --- NEW: Sync rotate/flip from FEN ---
                           const parts = historyFEN.fen.split(' ');
                           if (parts.length >= 4) {
                               isRotateEnabled = (parts[2] === '1');
                               isFlipEnabled = (parts[3] === '1');
                           }
                           // --------------------------------------

                           jumpToStep(currentStepIndex);
                           renderRecordUI();
                           updateToolHighlights();
                           saveStateToUndo();
                       }
                   } catch (err) {
                       console.error("Failed to parse JSON", err);
                   }
               };
               reader.readAsText(file);
           };
           input.click();
       });

2. 修改 tool-exp-txt 的文本確認導入邏輯

找到 btn-exp-confirm 的點擊事件(大約在第 1269 行):

JavaScript

        document.getElementById('btn-exp-confirm').addEventListener('click', () => {
           const txt = document.getElementById('textarea-exp').value.trim();
           if (!txt) return;
           try {
               const imported = JSON.parse(txt);
               if (imported.historyFEN) {
                   historyFEN = imported.historyFEN;
                   currentBranch = imported.currentBranch || [];
                   currentStepIndex = imported.currentStepIndex || 0;
                   moveInterval = parseFloat(imported.moveInterval) || moveInterval;
                   moveSpeed = parseFloat(imported.moveSpeed) || moveSpeed;

                   // --- NEW: Sync rotate/flip from FEN ---
                   const parts = historyFEN.fen.split(' ');
                   if (parts.length >= 4) {
                       isRotateEnabled = (parts[2] === '1');
                       isFlipEnabled = (parts[3] === '1');
                   }
                   // --------------------------------------

                   jumpToStep(currentStepIndex);
                   renderRecordUI();
                   
                   // Close the export UI
                   isExportTextMode = false;
                   document.querySelector('.ejceesexp').style.display = 'none';
                   
                   updateToolHighlights();
                   saveStateToUndo();
               }
           } catch (err) {
               alert("Invalid JSON data.");
           }
       });

為什麼這樣改?

  1. 數據驅動視角:在你的新 FEN 規範中,第三個和第四個參數(parts[2] 和 parts[3])已經明確記錄了該局面的旋轉與翻轉狀態。
  2. 自動同步:當用戶打開一個「已旋轉」的殘局存檔時,代碼會自動偵測到 1,並將 isRotateEnabled 設為 true,隨後 jumpToStep 調用 loadFEN 和 reapplyVisualPositions,棋盤就會自動以正確的角度呈現。
  3. UI 一致性:最後調用 updateToolHighlights() 確保側邊欄工具按鈕的選中狀態(Active Style)也能正確更新。